<script setup lang="ts">
import { Layout, Menu, MenuItem } from 'ant-design-vue'
import { computed } from 'vue'
import { useRouter } from 'vue-router'

const router = useRouter()

const menu = computed(() => {
  console.log(router,router.currentRoute.value.matched)
  const menu:any =router.currentRoute.value.matched.find(item=> item.path === '/manage')?.children
  return menu
})
</script>
<template>
  <Layout style="background: none; height: 100%">
    <Layout.Sider class="h-box-bg-radius" style="background: #fff; margin-right: 20px">
      <Menu :style="{ width: '100%', height: '100%', borderRight: 0 }">
        <MenuItem v-for="item in menu" :key="item.path">
          <router-link :to="{ name: item.name }">{{ item.meta?.title }}</router-link>
        </MenuItem>
      </Menu>
    </Layout.Sider>
    <Layout.Content class="h-box-bg-radius" style="overflow-y: scroll">
      <router-view></router-view>
    </Layout.Content>
  </Layout>
</template>
<style lang="scss" scoped></style>
